<template>
  商品页面
  <button @click="handleBackClick">返回上一页</button>
  <div class="bigbox">
    <div class="box2">
      <RouterLink to="/goods/list">商品列表</RouterLink><br />
      <RouterLink to="/goods/type">商品分类</RouterLink><br />
      <RouterLink to="/goods/add">商品添加</RouterLink><br />
    </div>
    <div>
      <!-- 二级路由出口 -->
      <RouterView></RouterView>
    </div>
  </div>
</template>

<script setup>
import { useRouter, useRoute, RouterLink } from "vue-router";
// useRouter路由实例对象
const router = useRouter();
// useRoute路由信息对象
const route = useRoute();
console.log(route);

const handleBackClick = () => {
  // // 返回上一页
  // router.back();
  router.go(-1);
};
</script>

<style lang="scss" scoped>
.bigbox {
  height: 100vh;
  width: 100vw;
  background-color: #f2f2f2;
  display: flex;
  .box2 {
    width: 200px;
    height: 100vh;
    background-color: antiquewhite;
  }
}
</style>
